<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
</head>

<body>
    <input type="checkbox" id="ck" />
    <hr />
    <div id="div">
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" /><br />
        <input type="checkbox" />
    </div>
    <script type="text/javascript">
        //1）给最上面的复选框绑定一~个点击事件
        document.getElementById('ck').onclick = function () {
        
            //2）当一点击最上面的复选框的时候立刻获取下面所有的复选框
            let arrInputs = document.getElementById('div').children;
            //3）遍历获取下面每个复选框
            for (let i = 0; i < arrInputs.length; i++) {
                let element = arrInputs[i];
                //4）将最上面复选框此时checked的值赋值给下面每个复选框
                element.checked = this.checked;
            }
        }



    </script>
</body>

</html>